import React, {Component} from 'react'
import {Button, Col, Row} from 'antd'
import slidershowContentImg from '../../images/slideshow-content.png'
import RegisterStepModal from "./register/register-step-modal";

class SliderShow extends Component {
  state = {
    isRegisterModalOpen: false
  }

  render() {
    return <div style={{
      padding: '.7rem 0 .4rem 0',
      boxSizing: 'border-box',
      background: 'url("https://s3.cn-north-1.amazonaws.com.cn/tws-upload/images/slideshow-bg.png") no-repeat',
      backgroundSize: '100% 100%'
    }}>
      <Row type='flex' justify='center'>
        <Col xs={{span: 16}} lg={{span: 9}}>
          <img src={slidershowContentImg} width='100%'/>
        </Col>
      </Row>

      <Row type='flex' justify='center' style={{
        margin: '0.25rem 0px'
      }}>
        <Button type='primary' size='large'
                className='tws-4th-btn-signUp'
                onClick={() => this.setState({isRegisterModalOpen: true})}
                style={{
                  fontWeight: 'bold',
                  borderRadius: '0',
                  height: '.6rem'
                }}><span style={{fontSize: '20px'}}>我要报名</span></Button>
      </Row>
      <Row type='flex' justify='center'/>
      <RegisterStepModal
        isRegisterModalOpen={this.state.isRegisterModalOpen}
        closeModal={(callback) => this.setState({ isRegisterModalOpen: false },()=>callback())}/>
    </div>
  }
}

export default SliderShow



